<!DOCTYPE html>
<html>
  <head>
    <script src="/libs/ui/js/jquery-1.8.0.min.js"></script>
    <script src="/libs/ui/js/jquery-ui-1.8.23.custom.min.js"></script>
    <link type="text/css" href="/libs/ui/css/smoothness/jquery-ui-1.8.23.custom.css" rel="stylesheet" />
    <script src="/libs/jquery-ui-combobox.js"></script>
    <script src="/libs/jquery.hotkeys.js"></script>
    <script src="/libs/xregexp-min.js"></script>
    <script src="/scripts/options.js"></script>
    <script src="/scripts/utils.js"></script>
    <link type="text/css" href="/styles/options.css" rel="stylesheet" />
    <title>Redirector</title>
  </head>
  <body>
    <header class="header">
      <h1>Redirector</h1>
    </header>
    <div class="header-shadow"></div>

    <div class="container">
      <div class="content">
        <div id="nav-tabs">
          <ul>
            <li><a href="#nav-tab-rules" data-i18n="RULES"></a></li>
            <li><a href="#nav-tab-settings" data-i18n="SETTINGS"></a></li>
            <li><a href="#nav-tab-help" data-i18n="HELP"></a></li>
          </ul>
          <div id="nav-tab-rules">
            <div class="toolbar ui-widget-header button-set ui-corner-bottom">
              <button name="new"><span data-i18n="NEW"></span></button>
              <button name="edit"><span data-i18n="EDIT"></span></button>
              <button name="remove"><span data-i18n="REMOVE"></span></button>
              <input type="file" name="import" multiple />
              <button name="import"><span data-i18n="IMPORT"></span></button>
              <button name="export"><span data-i18n="EXPORT"></span></button>
            </div>

            <div id="rule-list-section">
              <ul id="rule-list" class="selectable-draggable-list"></ul>
            </div>
          </div> <!-- #nav-tab-rules -->

          <div id="nav-tab-settings">
            <form class="button-set">
              <h5 data-i18n="CONTEXT_MENU"></h5>
              <input type="radio" name="context" id="settings-1" data-enabled="true" checked /><label for="settings-1" data-i18n="ENABLE"></label>
              <input type="radio" name="context" id="settings-2" data-enabled="false" /><label for="settings-2" data-i18n="DISABLE"></label>
            </form>
            <form class="button-set">
              <h5 data-i18n="ICON_NOTIFICATION"></h5>
              <input type="radio" name="icon" id="settings-3" data-enabled="true" checked /><label for="settings-3" data-i18n="ENABLE"></label>
              <input type="radio" name="icon" id="settings-4" data-enabled="false" /><label for="settings-4" data-i18n="DISABLE"></label>
            </form>
            <form class="button-set">
              <h5 data-i18n="ENABLED_RULE_TYPES"></h5>
              <input type="checkbox" name="rule_type" id="settings-5" data-type="fast_matching" />
              <label for="settings-5" data-i18n="FAST_MATCHING"></label>
              <input type="checkbox" name="rule_type" id="settings-6" data-type="redirect" />
              <label for="settings-6" data-i18n="REDIRECT"></label>
              <input type="checkbox" name="rule_type" id="settings-7" data-type="request_header" />
              <label for="settings-7" data-i18n="REQUEST_HEADER"></label>
              <input type="checkbox" name="rule_type" id="settings-8" data-type="response_header" />
              <label for="settings-8" data-i18n="RESPONSE_HEADER"></label>
              <input type="checkbox" name="rule_type" id="settings-9" data-type="error_handling" />
              <label for="settings-9" data-i18n="ERROR_HANDLING"></label>
              <input type="checkbox" name="rule_type" id="settings-10" data-type="online" />
              <label for="settings-10" data-i18n="ONLINE"></label>
            </form>
            <form class="button-set">
              <h5 data-i18n="ENABLED_PROTOCOLS"></h5>
              <input type="checkbox" name="protocol" id="settings-11" data-type="http://*/*" /><label for="settings-11">HTTP</label>
              <input type="checkbox" name="protocol" id="settings-12" data-type="https://*/*" /><label for="settings-12">HTTPS</label>
              <input type="checkbox" name="protocol" id="settings-13" data-type="ftp://*/*" /><label for="settings-13">FTP</label>
              <input type="checkbox" name="protocol" id="settings-14" data-type="file://*/*" /><label for="settings-14">FILE</label>
            </form>
            <form class="button-set">
              <h5 data-i18n="MANUAL_REDIRECTION_METHODS"></h5>
              <input type="checkbox" name="manual" id="settings-15" data-type="page" /><label for="settings-15" data-i18n="PAGE"></label>
              <input type="checkbox" name="manual" id="settings-16" data-type="link" /><label for="settings-16" data-i18n="LINK"></label>
            </form>
            <form class="button-set">
              <h5 data-i18n="AUTO_SYNC"></h5>
              <input type="radio" name="sync" id="settings-17" data-enabled="true" checked /><label for="settings-17" data-i18n="ENABLE"></label>
              <input type="radio" name="sync" id="settings-18" data-enabled="false" /><label for="settings-18" data-i18n="DISABLE"></label>
              <button name="manual-sync"><span data-i18n="SYNC_NOW"></span></button>
            </form>
            <form class="button-set">
              <h5 data-i18n="ENABLE_DEBUGGER"></h5>
              <input type="radio" name="debugger" id="settings-19" data-enabled="true" checked /><label for="settings-19" data-i18n="ENABLE"></label>
              <input type="radio" name="debugger" id="settings-20" data-enabled="false" /><label for="settings-20" data-i18n="DISABLE"></label>
              <form class="button-set">
                <h5 data-i18n="BACKUP_AND_RESTORE"></h5>
                <button name="backup"><span data-i18n="BACKUP"></span></button>
                <input type="file" name="restore" />
                <button name="restore"><span data-i18n="RESTORE"></span></button>
              </form>
            </form>
          </div> <!-- #nav-tab-settings -->
          <div id="nav-tab-help">
            <p>TODO</p>
          </div> <!-- #nav-tab-help -->
        </div>   <!-- #nav-tabs -->
      </div><!-- .content -->
    </div> <!-- .container -->
    <!-- Rule Creator
      -->
    <div id="rule-creator">
      <h5 data-i18n="PLEASE_CHOOSE_A_RULE_TYPE"></h5>
      <form>
        <input type="radio" name="type" data-type="fast_matching" id="r-c-1" checked /><label for="r-c-1" data-i18n="FAST_MATCHING"></label><br />
        <input type="radio" name="type" data-type="redirect" id="r-c-2" /><label for="r-c-2" data-i18n="REDIRECT"></label><br />
        <input type="radio" name="type" data-type="request_header" id="r-c-3" /><label for="r-c-3" data-i18n="REQUEST_HEADER"></label><br />
        <input type="radio" name="type" data-type="response_header" id="r-c-4" /><label for="r-c-4" data-i18n="RESPONSE_HEADER"></label><br />
        <input type="radio" name="type" data-type="error_handling" id="r-c-5" /><label for="r-c-5" data-i18n="ERROR_HANDLING"></label><br />
        <input type="radio" name="type" data-type="online" id="r-c-6" /><label for="r-c-6" data-i18n="ONLINE"></label>
      </form>
    </div>
    <!-- Rule editors
      -->
    <div id="rule-editor" class="editor-dialog" title="Rule Editor">
      <form class="button-set">
        <input type="radio" name="rule-enabled" id="r-e-1" data-enabled="true" checked /><label for="r-e-1" data-i18n="ENABLE"></label>
        <input type="radio" name="rule-enabled" id="r-e-2" data-enabled="false" /><label for="r-e-2" data-i18n="DISABLE"></label>
      </form>
      <h5 data-i18n="NAME"></h5><input name="name" />
      <form class="online-rule button-set">
        <h5 data-i18n="URL"></h5>
        <input type="url" name="online" />
      </form>
      <div class="local-rule accordion">
        <h6><a href="#" data-i18n="CONDITIONS"></a></h6>
        <div>
          <form class="button-set">
            <button name="new-condition" data-i18n="NEW"><span></span></button>
            <button name="edit-condition"><span data-i18n="EDIT"></span></button>
            <button name="remove-condition"><span data-i18n="REMOVE"></span></button>
          </form>
          <ul id="rule-editor-conditions" class="selectable-draggable-list"></ul>
        </div>
        <h6><a href="#" data-i18n="ACTIONS"></a></h6>
        <div>
          <form class="button-set">
            <button name="new-action"><span data-i18n="NEW"></span></button>
            <button name="edit-action"><span data-i18n="EDIT"></span></button>
            <button name="remove-action"><span data-i18n="REMOVE"></span></button>
          </form>
          <ul id="rule-editor-actions" class="selectable-draggable-list"></ul>
        </div>
        <h6><a href="#" data-i18n="TEST"></a></h6>
        <form class="button-set">
          <input type="url" />
          <button type="submit" class="button-test" name="test-rule"><span data-i18n="TEST"></span></button>
        </form>
      </div>
    </div>
    <!-- Condition editors
      -->
    <!-- Fast matching rule condition -->
    <div id="condition-editor-fast_matching" class="editor-dialog" data-i18n="title:FAST_MATCHING_CONDITION">
      <form class="button-set">
        <input type="checkbox" name="resource" id="c-e-f_m-1" data-type="all" /><label for="c-e-f_m-1" data-i18n="ALL"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-2" data-type="main_frame" /><label for="c-e-f_m-2" data-i18n="MAIN_FRAME"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-3" data-type="sub_frame" /><label for="c-e-f_m-3" data-i18n="SUB_FRAME"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-4" data-type="stylesheet" /><label for="c-e-f_m-4" data-i18n="STYLESHEET"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-5" data-type="script" /><label for="c-e-f_m-5" data-i18n="SCRIPT"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-6" data-type="image" /><label for="c-e-f_m-6" data-i18n="IMAGE"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-7" data-type="object" /><label for="c-e-f_m-7" data-i18n="OBJECT"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-8" data-type="xmlhttprequest" /><label for="c-e-f_m-8" data-i18n="XHR"></label>
        <input type="checkbox" name="resource" id="c-e-f_m-9" data-type="other" /><label for="c-e-f_m-9" data-i18n="OTHER"></label>
      </form>
      <div class="accordion">
        <h6><a href="#" data-i18n="HOST"></a></h6>
        <form>
          <h5 data-i18n="CONTAINS"></h5><input name="hostContains" />
          <h5 data-i18n="EQUALS"></h5><input name="hostEquals" />
          <h5 data-i18n="PREFIX"></h5><input name="hostPrefix" />
          <h5 data-i18n="SUFFIX"></h5><input name="hostSuffix" />
        </form>
        <h6><a href="#" data-i18n="PATH"></a></h6>
        <form>
          <h5 data-i18n="CONTAINS"></h5><input name="pathContains" />
          <h5 data-i18n="EQUALS"></h5><input name="pathEquals" />
          <h5 data-i18n="PREFIX"></h5><input name="pathPrefix" />
          <h5 data-i18n="SUFFIX"></h5><input name="pathSuffix" />
        </form>
        <h6><a href="#" data-i18n="QUERY"></a></h6>
        <form>
          <h5 data-i18n="CONTAINS"></h5><input name="queryContains" />
          <h5 data-i18n="EQUALS"></h5><input name="queryEquals" />
          <h5 data-i18n="PREFIX"></h5><input name="queryPrefix" />
          <h5 data-i18n="SUFFIX"></h5><input name="querySuffix" />
        </form>
        <h6><a href="#" data-i18n="URL"></a></h6>
        <form>
          <h5 data-i18n="CONTAINS"></h5><input name="urlContains" />
          <h5 data-i18n="EQUALS"></h5><input name="urlEquals" />
          <h5 data-i18n="PREFIX"></h5><input name="urlPrefix" />
          <h5 data-i18n="SUFFIX"></h5><input name="urlSuffix" />
        </form>
        <h6><a href="#" data-i18n="SCHEMES"></a></h6>
        <form>
          <h5 data-i18n="SCHEMES"></h5>
          <input name="schemes" />
        </form>
        <h6><a href="#" data-i18n="PORTS"></a></h6>
        <form><h5 data-i18n="PORTS"></h5><input name="ports" /></form>
      </div>
    </div>
    <!-- Normal (Redirect / Request Header / Response Header /Error Handling) rule condition -->
    <div id="condition-editor-normal" class="editor-dialog" data-i18n="title:NORMAL_CONDITION">
      <form class="button-set">
        <input type="checkbox" name="resource" id="c-e-n-1" data-type="all" /><label for="c-e-n-1" data-i18n="ALL"></label>
        <input type="checkbox" name="resource" id="c-e-n-2" data-type="main_frame" /><label for="c-e-n-2" data-i18n="MAIN_FRAME"></label>
        <input type="checkbox" name="resource" id="c-e-n-3" data-type="sub_frame" /><label for="c-e-n-3" data-i18n="SUB_FRAME"></label>
        <input type="checkbox" name="resource" id="c-e-n-4" data-type="stylesheet" /><label for="c-e-n-4" data-i18n="STYLESHEET"></label>
        <input type="checkbox" name="resource" id="c-e-n-5" data-type="script" /><label for="c-e-n-5" data-i18n="SCRIPT"></label>
        <input type="checkbox" name="resource" id="c-e-n-6" data-type="image" /><label for="c-e-n-6" data-i18n="IMAGE"></label>
        <input type="checkbox" name="resource" id="c-e-n-7" data-type="object" /><label for="c-e-n-7" data-i18n="OBJECT"></label>
        <input type="checkbox" name="resource" id="c-e-n-8" data-type="xmlhttprequest" /><label for="c-e-n-8" data-i18n="XHR"></label>
        <input type="checkbox" name="resource" id="c-e-n-9" data-type="other" /><label for="c-e-n-9" data-i18n="OTHER"></label>
      </form>
      <div>
        <form class="button-set">
          <input type="radio" name="type" id="c-e-n-10" data-type="regexp" checked /><label for="c-e-n-10" data-i18n="REGEXP"></label>
          <input type="radio" name="type" id="c-e-n-11" data-type="wildcard" /><label for="c-e-n-11" data-i18n="WILDCARD"></label>
          <input type="radio" name="type" id="c-e-n-12" data-type="manual" /><label for="c-e-n-12" data-i18n="MANUAL"></label>
        </form>
        <form class="button-set">
          <input type="checkbox" name="modifier" id="c-e-n-13" data-type="i" /><label for="c-e-n-13" data-i18n="CASE_INSENSITIVE"></label>
        </form>
        <form><h5 data-i18n="VALUE"></h5><textarea name="value"></textarea></form>
      </div>
      <form class="button-set">
        <h5 data-i18n="TEST"></h5>
        <input type="url" />
        <button type="submit" class="button-test" name="test-condition"><span data-i18n="TEST"></span></button>
      </form>
    </div>
    <!-- Action creator (for fast matching rules)
      -->
    <div id="action-creator">
      <h5 data-i18n="PLEASE_CHOOSE_A_ACTION_TYPE"></h5>
      <form>
        <input type="radio" name="type" id="a-c-1" data-type="redirect" checked /><label for="a-c-1" data-i18n="REDIRECT"></label><br />
        <input type="radio" name="type" id="a-c-2" data-type="request_header" /><label for="a-c-2" data-i18n="REQUEST_HEADER"></label><br />
        <input type="radio" name="type" id="a-c-3" data-type="response_header" /><label for="a-c-3" data-i18n="RESPONSE_HEADER"></label>
      </form>
    </div>
    <!-- Action editors
      -->
    <!-- Redirect action -->
    <div id="action-editor-redirect" class="editor-dialog" data-i18n="title:REDIRECT">
      <form class="button-set">
        <input type="radio" name="type" id="a-e-r-1" data-type="redirect_regexp" checked /><label for="a-e-r-1" data-i18n="REGEXP"></label>
        <input type="radio" name="type" id="a-e-r-2" data-type="redirect_wildcard" /><label for="a-e-r-2" data-i18n="WILDCARD"></label>
        <input type="radio" name="type" id="a-e-r-3" data-type="redirect_cancel" /><label for="a-e-r-3" data-i18n="CANCEL"></label>
        <input type="radio" name="type" id="a-e-r-4" data-type="redirect_to" /><label for="a-e-r-4" data-i18n="TO"></label>
        <input type="radio" name="type" id="a-e-r-5" data-type="redirect_to_transparent" /><label for="a-e-r-5" data-i18n="TO_TRANSPARENT_IMAGE"></label>
        <input type="radio" name="type" id="a-e-r-6" data-type="redirect_to_empty" /><label for="a-e-r-6" data-i18n="TO_EMPTY_DOCUMENT"></label>
      </form>
      <div>
        <form class="button-set">
          <input type="checkbox" name="modifier" id="a-e-r-7" data-type="i" /><label for="a-e-r-7" data-i18n="CASE_INSENSITIVE"></label>
          <input type="checkbox" name="modifier" id="a-e-r-8" data-type="g" /><label for="a-e-r-8" data-i18n="GLOBAL_MATCH"></label>
          <input type="checkbox" name="decode" id="a-e-r-9" data-type="g" /><label for="a-e-r-9" data-i18n="DECODE"></label>
        </form>
        <form><h5 data-i18n="FROM"></h5><textarea name="from"></textarea></form>
        <form><h5 data-i18n="TO"></h5><input name="to" /></form>
      </div>
      <form class="button-set">
        <h5 data-i18n="TEST"></h5>
        <input type="url" />
        <button type="submit" class="button-test" name="test-action"><span data-i18n="TEST"></span></button>
      </form>
    </div>
    <!-- Modify request header action -->
    <div id="action-editor-request_header" class="editor-dialog" data-i18n="title:REQUEST_HEADER">
      <form class="button-set">
        <input type="radio" name="type" id="a-e-r_h-1" data-type="request_header_set" checked /><label for="a-e-r_h-1" data-i18n="SET"></label>
        <input type="radio" name="type" id="a-e-r_h-2" data-type="request_header_remove" /><label for="a-e-r_h-2" data-i18n="REMOVE"></label>
      </form>
      <h5 data-i18n="NAME"></h5>
      <select name="name">
        <option value=""></option>
        <option value="Accept">Accept</option>
        <option value="Accept-Charset">Accept-Charset</option>
        <option value="Accept-Encoding">Accept-Encoding</option>
        <option value="Accept-Language">Accept-Language</option>
        <option value="Accept-Datetime">Accept-Datetime</option>
        <!-- <option value="Authorization"></option> -->
        <!-- <option value="Cache-Control">Cache-Control</option> -->
        <!-- <option value="Connection">Connection</option> -->
        <option value="Cookie">Cookie</option>
        <!-- <option value="Content-Length">Content-Length</option> -->
        <option value="Content-MD5">Content-MD5</option>
        <option value="Content-Type">Content-Type</option>
        <option value="Date">Date</option>
        <option value="Expect">Expect</option>
        <option value="From">From</option>
        <!-- <option value="Host">Host</option> -->
        <option value="If-Match">If-Match</option>
        <!-- <option value="If-Modified-Since">If-Modified-Since</option> -->
        <!-- <option value="If-None-Match">If-None-Match</option> -->
        <!-- <option value="If-Range">If-Range</option> -->
        <option value="If-Unmodified-Since">If-Unmodified-Since</option>
        <option value="Max-Forwards">Max-Forwards</option>
        <!-- <option value="Pragma">Pragma</option> -->
        <!-- <option value="Proxy-Authorization">Proxy-Authorization</option> -->
        <option value="Range">Range</option>
        <option value="Referer">Referer</option>
        <option value="TE">TE</option>
        <option value="Upgrade">Upgrade</option>
        <option value="User-Agent">User-Agent</option>
        <option value="Via">Via</option>
        <option value="Warning">Warning</option>
        <!-- non-standard -->
        <option value="X-Requested-With">X-Requested-With</option>
        <option value="DNT">DNT</option>
        <option value="X-Forwarded-For">X-Forwarded-For</option>
        <option value="X-ATT-DeviceId">X-ATT-DeviceId</option>
        <option value="X-Wap-Profile">X-Wap-Profile</option>
        <!-- <option value="Proxy-Connection">Proxy-Connection</option> -->
      </select>
      <h5 data-i18n="VALUE"></h5><input name="value" />
    </div>
    <!-- Modify Response Header action -->
    <div id="action-editor-response_header" class="editor-dialog" data-i18n="title:RESPONSE_HEADER">
      <form class="button-set">
        <input type="radio" name="type" id="a-e-s_h-1" data-type="response_header_add" checked /><label for="a-e-s_h-1" data-i18n="ADD"></label>
        <input type="radio" name="type" id="a-e-s_h-2" data-type="response_header_remove" /><label for="a-e-s_h-2" data-i18n="REMOVE"></label>
      </form>
      <form class="button-set">
        <input type="checkbox" name="match_value" id="a-e-s_h-3" /><label for="a-e-s_h-3" data-i18n="MATCH_VALUE"></label>
      </form>
      <h5 data-i18n="NAME"></h5>
      <select name="name">
        <option value=""></option>
        <option value="Accept-Ranges">Accept-Ranges</option>
        <option value="Age">Age</option>
        <option value="Allow">Allow</option>
        <option value="Cache-Control">Cache-Control</option>
        <option value="Connection">Connection</option>
        <option value="Content-Encoding">Content-Encoding</option>
        <option value="Content-Language">Content-Language</option>
        <option value="Content-Length">Content-Length</option>
        <option value="Content-Location">Content-Location</option>
        <option value="Content-MD5">Content-MD5</option>
        <option value="Content-Disposition">Content-Disposition</option>
        <option value="Content-Range">Content-Range</option>
        <option value="Content-Type">Content-Type</option>
        <option value="Date">Date</option>
        <option value="ETag">ETag</option>
        <option value="Expires">Expires</option>
        <option value="Last-Modified">Last-Modified</option>
        <option value="Link">Link</option>
        <option value="Location">Location</option>
        <option value="P3P">P3P</option>
        <option value="Pragma">Pragma</option>
        <option value="Proxy-Authenticate">Proxy-Authenticate</option>
        <option value="Refresh">Refresh</option>
        <option value="Retry-After">Retry-After</option>
        <option value="Server">Server</option>
        <option value="Set-Cookie">Set-Cookie</option>
        <option value="Strict-Transport-Security">Strict-Transport-Security</option>
        <option value="Trailer">Trailer</option>
        <option value="Transfer-Encoding">Transfer-Encoding</option>
        <option value="Vary">Vary</option>
        <option value="Via">Via</option>
        <option value="Warning">Warning</option>
        <option value="WWW-Authenticate">WWW-Authenticate</option>
        <!-- non-standard -->
        <option value="X-Frame-Options">X-Frame-Options</option>
        <option value="X-XSS-Protection">X-XSS-Protection</option>
        <option value="X-Content-Type-Options">X-Content-Type-Options</option>
        <option value="X-Forwarded-Proto">X-Forwarded-Proto</option>
        <option value="Front-End-Https">Front-End-Https</option>
        <option value="X-Powered-By">X-Powered-By</option>
        <option value="X-UA-Compatible">X-UA-Compatible</option>
      </select>
      <h5 data-i18n="VALUE"></h5><input name="value" />
    </div>
  </body>
</html>
